<template>
    <view class="content">
        <view class="u-p-b-20">
            <u-search placeholder="请输入名称" v-model="keyword" :show-action="false" bg-color="#fff" @search="doSearch"></u-search>
        </view>
        
        <view class="item" v-for="(item,index) in list" :key='index' @click="$gTo('/staff/pages/shopowner/broker-details?id='+ item.id)">
            <view class="u-flex">
                <image :src="item.image || '../../../static/icon/avatar.png'" class="avatar"></image>
                <view class="u-flex-1">
                    <view class="name">{{item.user_name}}</view>
                    <view>手机号：{{item.phone}}</view>
                    <view>待结佣：{{item.pending_money}}元</view>
                </view>
            </view>
            <view class="btns">
                <view class="bh-btn" @click.stop="toExamine(item, 1)" 
                    v-if="item.work_status == 3 && (info.user_type == 1 || info.user_type == 2)">驳回</view>
                <view class="tg-btn" @click.stop="toExamine(item, 2)" 
                    v-if="item.work_status == 3 && (info.user_type == 1 || info.user_type == 2)">通过</view>
                <view class="btn" @click.stop="toChat(item)">微聊</view>
                <view class="tg-btn" @click.stop="enable(item)" v-if="item.user_status == 2">启用账号</view>
            </view>
        </view>
        <!-- user_status 1启用 2禁用 work_status 1在职 2离职 3申请离职 -->
        <!-- user_type 1运维经理 2运维总监 3项目驻场 4项目总监 5经纪人 6店长 7管理员 8报备专员 9策划 -->
        
        <view style="height: 94rpx;padding-top: 30rpx;">
            <u-loadmore :status="status" v-if="status != 'loadmore'" />
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                noClick:true,//连点
                status: 'loadmore', //是否显示没有更多了
                page: 1,
                list: [], 
                type: 1,
                keyword: '',
                info: {},
            }
        },
        onLoad(option) {
            // uni.setNavigationBarTitle({
            // 	title:'项目驻场'
            // })
            this.type = option.type
            this.getList()
            this.getInfo()
        },
        onReachBottom() {
        	if(this.page == 1){return}
        	this.getList()
        },
        methods: {
            // 微聊
            toChat(item) {
                this.$gTo('/pages/chat/chat-details?data=' + JSON.stringify(item))
            },
            
            // 通过、驳回
            toExamine(item, num) {
                this.$ajax('user_depart_examine', {
                	user_token: this.$getSync('userToken'),
                	id: item.id,//人员id
                    status: num,//2通过 1驳回
                }).then(ret => {
                	if (ret.success == 1000) {
                		this.$toast('提交成功');
                        setTimeout(() => {
                            this.doSearch()
                        }, 500)
                	} else {
                		this.$toast(ret.msg);
                	}
                });
            },
            
            // 人员启用
            enable(item) {
                this.$ajax('user_enable', {
                	user_token: this.$getSync('userToken'),
                	id: item.id,//人员id
                }).then(ret => {
                	if (ret.success == 1000) {
                		this.$toast('提交成功');
                        setTimeout(() => {
                            this.doSearch()
                        }, 500)
                	} else {
                		this.$toast(ret.msg);
                	}
                });
            },
            
            doSearch() {
                this.page = 1
                this.list = []
                this.status = 'loadmore'
                this.getList()
            },
            
            // 获取列表
            getList() {
            	if (this.status == 'nomore') return;
            	this.status = 'loading';
            	this.$ajax('my_personnel', {
            		user_token: this.$getSync('userToken'),
            		page: this.page,
            		limit: 10,
                    user_type: this.type,//1运维经理 3项目驻场 5经纪人 6店长
                    status: '',//1本区 2大区
                    name: this.keyword,//搜索
            	}).then(ret => {
            		if (ret.success == 1000) {
            			if (ret.detail.data.length > 0) {
            				this.list = this.list.concat(ret.detail.data);
            				this.page++;
            				this.status = 'loadmore'
            			} else {
            				this.status = 'nomore'
            			}
            		} else {
            			this.$toast(ret.msg);
            		}
            	});
            },
            
            // 获取个人信息
            getInfo() {
                this.$ajax('person_detail', {
                    user_token: this.$getSync('userToken'),
                }).then(ret => {
                    if (ret.success == 1000) {
                        this.info = ret.detail
                    } else {
                        this.$toast(ret.msg);
                    }
                });
            },
        },
    }
</script>

<style lang="scss">
    page {
        background: #f5f5f5;
    }
    .content{
        padding: 20rpx;
    }
    .item{
        background-color: #fff;
        border-radius: 20rpx;
        padding: 30rpx 25rpx;
        margin-bottom: 20rpx;
        font-size: 24rpx;
    }
    .avatar{
        width: 88rpx;
        height: 88rpx;
        border-radius: 50%;
        margin-right: 20rpx;
    }
    .name{
        font-size: 32rpx;
        font-weight: bold;
        padding-bottom: 10rpx;
    }
    .btns{
        display: flex;
        justify-content: flex-end;
        align-items: center;
        padding-top: 10rpx;
    }
    .btns>view{
        color: #fff;
        line-height: 1;
        padding: 10rpx 18rpx;
        border-radius: 50rpx;
        margin-left: 10rpx;
    }
    .btn{
        background-color: #09bb07;
    }
    .tg-btn{
        background-color: #00a1e9;
    }
    .bh-btn{
        background-color: #fe6155;
    }
    
    
</style>

